<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML lang="es">


    <HEAD >
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
        <meta http-equiv="Content-Script-Type" content="text/javascript; charset=iso-8859-1">
        <link rel="stylesheet" href="style.css" type="text/css" media="screen" />
        <link rel="stylesheet" href="TablaScroll.css" type="text/css" media="screen" />
        <SCRIPT  LANGUAGE="JavaScript1.5" type="text/javascript" SRC="JSSQL.js" charset="ISO-8859-1"></SCRIPT>
        <SCRIPT  LANGUAGE="JavaScript1.5" type="text/javascript" SRC="bases.js" charset="ISO-8859-1"></SCRIPT>
        <SCRIPT LANGUAGE="JavaScript1.5" type="text/javascript" charset="ISO-8859-1">
            <!--

            var myJSSQL= new JSSQL();
            function Open(bd)
            {
                if (!myJSSQL.Open(bd))
                {
                    document.getElementById('mensaje').innerHTML=myJSSQL.GetError();
                    document.getElementById('mensaje').style.display="block";
                    
                }
                else{
                    
                    Print_DB(myJSSQL.GetDef());
                    document.getElementById('mensaje').style.display="none";
                }
 
            }

            function isArray(obj){

                if (obj.constructor.toString().indexOf("Array") == -1)
                    return false;
                else
                    return true;
            }


            function Print_Array(arr)
            {
                var i,j;
                var r='';

                if (typeof(arr[0])=='undefined'){
                    //array asociativo
                    r+="<table class='tabla'>";
                    r+="<tr>";
                    r+="<th>";
                    r+="Prop";
                    r+="</th>";
                    r+="<th>";
                    r+="Val";
                    r+="</th>";
                    r+="</tr>";
                    for (i in arr){
                        r+="</tr>";
                        r+="<td>";
                        r+=i;
                        r+="</td>";
                        r+="<td>";
                        r+=arr[i];
                        r+="</td>";
                        r+="</tr>";
                    }

                    r+="</table>"

                }
                else
                {
                    r+="<table class='tabla'>";
                    r+="<tr>";

                    r+="<th>";
                    r+="ID";
                    r+="</th>";


                    for (i in arr[0])
                    {
                        r+="<th>";
                        r+=i;
                        r+="</th>";
                    }
                    r+="</tr>";

                    for (i=0;i<arr.length ; i++)
                    {
                        r+="<tr>";
                        r+="<td>";
                        r+=i;
                        r+="</td>";

                        for (j in arr[i] )
                        {
                            r+="<td>";
                            r+=arr[i][j];
                            r+="</td>";

                        }
                        r+="</tr>";
                    }
                    r+="</table>";
                }
                return r;

            }
            function Print_Debug(deb){
                
                r='';
                for (campo in deb){
                    r+='<b>'+deb[campo][0]+':</b> ';
                    if (!isArray(deb[campo][1]))
                        r+=deb[campo][1]+'<br>';
                    else
                        r+=Print_Array(deb[campo][1])+'<br>';
                }

                    
                return r;

            }

            function Print_DB(arr){
                r='';
                for (i in arr){
                    
                    r+='<table class="tabla" style=\'margin:10px;.margin:10px;display:inline;\'>';
                    r+='<tr><th colspan="2">'+arr[i].tname+'</th></tr>';
                    r+='<tr><th>campo</th><th>tipo</th></tr>';
                    for (j in arr[i].fields){
                        var I1='';
                        var I2='';
                        if (arr[i].fields[j].findex){
                            I1='<i>';
                            I2='</i>';
                        }

                        r+='<tr><td><b>'+arr[i].fields[j].fname+'</b></td><td>'+I1+arr[i].fields[j].ftype+I2+'</td></tr>';
                    }
                    r+='</table> ';

                }
                
                document.getElementById('tablas').innerHTML=r;
                
            }

            var CantCamposRes=0;
             function Print_r(arr)
            {
                var r=Array();


                r.push('<div class="scrollTableHead" id="TablaScrollEncCont_mitabla">\n');
                r.push('<div id="TablaScrollEnc_mitabla" style="width:10000px;">\n');
                i=1;
                for (campo in arr[0])
                {
                    r.push('<div id="mitabla_e'+i+'" class="enc" ></div>\n');
                    i++;
                }
                CantCamposRes=i;


                r.push('<div id="mitabla_e'+i+'" class="enc" ></div>\n');
                i++;
                //r.push('<div id="mitabla_e'+i+'" class="enc" ></div>\n');

                r.push('</div>\n');
                r.push('</div>\n');
                r.push('<div class="scrollTableContainer" onscroll="TablaScrollReset(\'mitabla\');" id="TablaScrollDataCont_mitabla">\n');
                r.push('<table class="dataTable" cellspacing="0">\n');
                r.push('<thead >\n');
                r.push('<tr >\n');
                i=1;
                r.push('<th id="mitabla_d'+i+'" >Reg.</th>\n');
                i++
                for (campo in arr[0])
                {
                    r.push('<th id="mitabla_d'+i+'" >'+campo+'</th>\n');
                    i++;
                }
                r.push('</tr>\n');
                r.push('</thead>\n');


                r.push('<tbody>\n');

                for (i=0;i<arr.length ; i++)
                {
                    r.push("<tr>");
                    r.push("<td><b>");
                    r.push(i);
                    r.push("</b></td>");

                    for (j in arr[i] )
                    {
                        r.push("<td>");
                        r.push(arr[i][j]);
                        r.push("</td>");

                    }
                    r.push("</tr>");
                }
                r.push("</tbody>");
                r.push("</table><div style='height:295px'></div>");

                return r.join('');

            }
/*            function Print_r(arr)
            {
                var r='';


                r+='<div class="scrollTableHead" id="TablaScrollEncCont_mitabla">\n';
                r+='<div id="TablaScrollEnc_mitabla" style="width:10000px;">\n';
                i=1;
                for (campo in arr[0])
                {
                    r+='<div id="mitabla_e'+i+'" class="enc" ></div>\n';
                    i++;
                }
                CantCamposRes=i;

                
                r+='<div id="mitabla_e'+i+'" class="enc" ></div>\n';
                i++;
                //r+='<div id="mitabla_e'+i+'" class="enc" ></div>\n';

                r+='</div>\n';
                r+='</div>\n';
                r+='<div class="scrollTableContainer" onscroll="TablaScrollReset(\'mitabla\');" id="TablaScrollDataCont_mitabla">\n';
                r+='<table class="dataTable" cellspacing="0">\n';
                r+='<thead >\n';
                r+='<tr >\n';
                i=1;
                r+='<th id="mitabla_d'+i+'" >Reg.</th>\n';
                i++
                for (campo in arr[0])
                {
                    r+='<th id="mitabla_d'+i+'" >'+campo+'</th>\n';
                    i++;
                }
                r+='</tr>\n';
                r+='</thead>\n';


                r+='<tbody>\n';
                
                for (i=0;i<arr.length ; i++)
                {
                    r+="<tr>";
                    r+="<td><b>";
                    r+=i;
                    r+="</b></td>";

                    for (j in arr[i] )
                    {
                        r+="<td>";
                        r+=arr[i][j];
                        r+="</td>";

                    }
                    r+="</tr>";
                }
                r+="</tbody>";
                r+="</table><div style='height:295px'></div>";

                return r;

            }*/

            //alert(base1[0]);

            function query()
            {
                var sql,res,r,i,j;
                sql=document.getElementById('sql').value;
                document.getElementById('mensaje').innerHTML='';
                document.getElementById('res').innerHTML='';
                document.getElementById('debug').innerHTML='';

                myJSSQL.useIndex = document.getElementById('useIndex').checked;
                
                res=myJSSQL.Query(sql);

                if(res===false )
                {
                    document.getElementById('mensaje').innerHTML=myJSSQL.GetError();
                    document.getElementById('mensaje').style.display="block";

                    r=document.getElementById('debug');
                    r.innerHTML=Print_Debug(myJSSQL.GetDebug());
                }
                else {
                    r=document.getElementById('res');
                    document.getElementById('mensaje').style.display="none";
                    r.innerHTML+=Print_r(res);
                    
                    TablaScrollSet('mitabla',CantCamposRes);

                    r=document.getElementById('debug');
                    r.innerHTML=Print_Debug(myJSSQL.GetDebug());
                    
                }
        

            }

            function Load(){
                document.getElementById('bases').innerHTML=bases;


                var s=location.search.substring(1);
                s=unescape(s.replace(/\+/g,' '));
                s=s.match(/sql=(.*)/);
                if(s!=null){
                    Open('neptuno');
                    ShowHide('marco_base');
                    document.getElementById('sql').innerHTML=s[1];
                    query();
                }
                else
                    Open(document.getElementById('bases_sel').value);

                


                
                
            }


            function ShowHide(marco)
            {
                var m;
                m=document.getElementById(marco);
                a=document.getElementById('a_'+marco);
                
                if (m.style.display=='block'){
                    m.style.display='none'
                    a.innerHTML='[ + ]'
                }
                else                    {
                    m.style.display='block'
                    a.innerHTML='[ - ]'
                }

            }


            /* tabla scroll */

            var TablaScrollH;
            function TablaScrollSet(nombre,cant){

                enc=document.getElementById("TablaScrollEnc_"+nombre);
                var x=0;
                for (i =1;i<=cant;i++)
                {
                    d=document.getElementById(nombre+'_d'+i);
                    e=document.getElementById(nombre+'_e'+i);

                    e.style.width=d.offsetWidth-2;
                    e.style.height=d.offsetHeight;
                    e.style.left=d.offsetLeft-1;
                    e.innerHTML=d.innerHTML;

                }
                x=e.style.width;
                //e=document.getElementById(nombre+'_e'+i);
                //e.style.width=50;
                //e.style.left=d.offsetLeft+x;
                TablaScrollH=d.offsetHeight +1;
                enc.style.height=TablaScrollH;

                TablaScrollReset(nombre);
            }

            function TablaScrollReset(nombre){
                d=document.getElementById("TablaScrollDataCont_"+nombre);
                dh=document.getElementById("TablaScrollEncCont_"+nombre);

                dh.scrollLeft=d.scrollLeft;

                if(d.scrollTop < TablaScrollH )
                    d.scrollTop=TablaScrollH;


            }

            /// Funciones externas al motor para testeo
            function DateFormat(numero){
                var d= new Date(numero);
                var s= pad(d.getDate()+1,2) + '/' + pad(d.getMonth()+1,2) + '/' +  d.getFullYear();
                return s;
            };
            function pad(number, length) {

                var str = '' + number;
                while (str.length < length) {
                    str = '0' + str;
                }


                return str;

};
            //-->
        </SCRIPT>
        <TITLE> Java Script SQL - Demo </TITLE>
    </HEAD>

    <BODY onload="Load();">

        <div id="container">
            <div class="header">
                <a href="http://javascriptsql.sourceforge.net" target="_blank"><img src="images/ico_small.gif" alt="JavaScript SQL"></a>
                <h1>JavaScript<b>SQL</b></h1>
                Un motor de bases de dato enteramente en JavaScript

            </div>

            <div id="mensaje" class="error">

            </div>

            <div class="box_container" >
                <h2 ><a id="a_marco_base" href="#" onclick="ShowHide('marco_base');return false;" >[ - ]</a> Base de datos seleccionada   <div id="bases" style="display:inline;"></div> </h2>

                <div id="marco_base" style="display:block;">

                    <div id="tablas" class="div_tablas" style="display:block;"> </div>

                </div>
            </div>
            <div class="box_container">
                <h2><a id="a_marco_sql" href="#" onclick="ShowHide('marco_sql');return false;" >[ - ]</a> SQL</h2>
                <div id="marco_sql" style="display:block;">
                    utilizar indices <input type="checkbox" id="useIndex" checked>
                    <TEXTAREA id="sql" ROWS="3" COLS="50"></TEXTAREA>

                    <INPUT TYPE="button" VALUE="Ejecutar" ONCLICK="query();" class="button"><br>
                </div>
            </div>

            <div class="box_container">
                <h2><a id="a_res" href="#" onclick="ShowHide('res');return false;" >[ - ]</a> Resultado:</h2>
                <div id="res" style="display:block;"></div>
            </div>
            <div class="box_container">
                <h2><a id="a_debug" href="#" onclick="ShowHide('debug');return false;" >[ + ]</a> Debug:</h2>
                <div id="debug" style="display:none;"></div>
            </div>
        </div>
        <div id="footer">
            <a href="http://sourceforge.net/projects/javascriptsql" target="_blank"><img src="http://sflogo.sourceforge.net/sflogo.php?group_id=313831&amp;type=9" width="80" height="15" alt="Get JavaScript SQL (JSSQL) at SourceForge.net. Fast, secure and Free Open Source software downloads" /></a> &nbsp;&nbsp;&nbsp;&nbsp;<a href="http://javascriptsql.sourceforge.net" target="_blank">javascriptsql.sourceforge.net</a>&nbsp;&nbsp;&nbsp;&nbsp;<a href="mailto:joaquin.becerra@gmail.com">joaquin.becerra@gmail.com </a><br>
            &Uacute;ltima actualizaci&oacute;n: Enero 2011

        </div>
    </BODY>
</HTML>

